<template>
	<view class="backConfirm">
		<!-- 材料归还 --- 材料归还确认 -->
		<navBar title="材料归还确认" goBackUrl="/subpackage-materials/pages/materials/materialsGoBack/components/backList"
			@goBack="goBack"></navBar>

		<scroll-view scroll-y="true" class="scroll-box">
			<view class="content">
				<view class="box uniCollapse">
					<uni-collapse>
						<uni-collapse-item v-for="(item,index) in list" title-border="show" :key="index"
							:title="item.name">
							<view class="center" v-for="(i,j) in item.list" :key="j">
								<view class="item">
									<view class="name">规格型号：</view>
									<view class="value">{{i.specificationModel}}</view>
								</view>
								<view class="item">
									<view class="name">过保日期：</view>
									<view class="value">{{i.time}}</view>
								</view>
								<!-- 	<view class="item">
									<view class="name">存储区域：</view>
									<view class="value">{{i.storageAreaName}}</view>
								</view> -->
								<view class="item">
									<view class="name">供应商：</view>
									<view class="value">{{i.supplier}}</view>
								</view>
								<view class="item">
									<view class="name">出库数量：</view>
									<view class="value">{{i.exNum}}{{i.unit}}</view>
								</view>
								<view class="item m40">
									<view class="name">归还数量：</view>
									<view class="value right">
										<u-number-box class="number" :min="0" :max="i.exNum" v-model="i.outNum"
											@change="curr=>comeNumChange(curr,j,index)" color="#323233"></u-number-box>
										<text class="unit">{{i.unit}}</text>
									</view>
								</view>
							</view>
						</uni-collapse-item>
					</uni-collapse>
				</view>

				<view class="button">
					<u-button type="error" text="取消" @click="cancel"></u-button>
					<u-button type="primary" :loading="loading" text="提交" @click="submit"></u-button>
				</view>
			</view>
		</scroll-view>

	</view>
</template>

<script>
	import {
		getMaterialBackSaveEx
	} from "@/api/materials/materials.js"
	import {
		mapMutations,
		mapState
	} from "vuex"
	import mixins from "@/utils/mixins.js"
	import uniCollapse from "./../../../components/uni-collapse/components/uni-collapse/uni-collapse.vue";
	export default {
		name: "backConfirm",
		mixins: [mixins],
		components: {
			uniCollapse
		},
		data() {
			return {
				list: [],
				loading: false,
				item: {}
			}
		},
		computed: {
			...mapState('materials', ['goBackSubmitList', 'materialsGoBackSubmitItem'])
		},
		mounted() {
			this.init()
		},
		methods: {
			init() {
				let typeList = Array.from(new Set(this.goBackSubmitList.map(item => item.name)))
				this.item = this.materialsGoBackSubmitItem
				typeList.forEach(item => {
					let itemObj = {
						name: item,
						list: [],
					}
					this.goBackSubmitList.forEach(i => {
						if (item === i.name) {
							if (i.expirationDate) {
								i.time = this.getDate(i.expirationDate)
							}
							itemObj.list.push(i)
						}
					})
					this.list.push(itemObj)
				})
				console.log('list', this.list)
			},
			comeNumChange(curr, i, index) {
				this.list[index].list[i].outNum = curr
			},
			submit() {
				let res = []
				this.list.forEach(item => {
					item.list.forEach(i => {
						if (i.outNum > 0) {
							res.push(i)
						}
					})
				})
				if (res.length === 0) {
					uni.showToast({
						title: '清先选择材料',
						icon: 'error'
					})
					return
				}
				this.loading = true
				let materialNames = Array.from(new Set(res.map(item => item.name))).join(",")
				let tempMaterialList = []
				let materialList = []
				console.log(res)
				res.forEach(item => {
					let tmp = {
						materialId: item.id,
						num: item.outNum
					}
					//非临时材料
					if (item.type === 0) {
						materialList.push(tmp)
					} else {
						tempMaterialList.push(tmp)
					}
				})
				let _params = {
					exCode: this.item.code,
					projectCascade: this.item.projectCascade,
					materialNames: materialNames,
					tempMaterialList: tempMaterialList,
					materialList: materialList
				}
				console.log(_params)
				getMaterialBackSaveEx(_params).then(data => {
					this.loading = false
					if (data.success) {
						uni.showToast({
							icon: "none",
							title: "保存成功"
						})
						uni.redirectTo({
							url: "/subpackage-materials/pages/materials/materialsGoBack/materialsGoBack"
						})
					}
				})

			},

			cancel() {
				uni.navigateBack({
					url: "/subpackage-materials/pages/materials/materialsGoBack/components/backList"
				})
			},

			goBack(url) {
				uni.navigateBack({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.backConfirm {
		padding-bottom: 110rpx;
		/* #ifdef MP-WEIXIN */
		padding-top: 200rpx;

		/* #endif */
		.scroll-box {
			max-height: calc(100vh - 280rpx);
			padding-top: 10rpx;
		}

		.content {
			padding: 30rpx 34rpx;
			background: #F5F7FA;
			min-height: 990rpx;

			.box {
				background-color: #FFFFFF;
			}

			.center {
				background-color: #FFFFFF;
				padding: 32rpx 38rpx;
				padding-top: 12rpx;
				border-bottom: 2rpx solid #E2E5ED;

				.item {
					display: flex;
					align-items: center;
					margin-top: 20rpx;

					.name {
						width: 150rpx;
					}

					.value {
						flex: 1;
					}

					.right {
						display: flex;
						align-items: center;
						justify-content: flex-end;
					}

					.unit {
						margin-left: 10rpx;
					}
				}

				.m40 {
					justify-content: space-between;
					margin-top: 20rpx;
				}
			}
		}

		.button {
			position: fixed;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 110rpx;
			line-height: 110rpx;
			display: flex;
			text-align: center;
			color: #FFFFFF;
			font-size: 32rpx;

			.cancel {
				flex: 1;
				background: #FF6A6A;
			}

			.canfirm {
				flex: 1;
				background: #2F80ED;
			}

		}
	}
</style>